/**
* @file 成员
* @author 张超
* @created 2023/12/23 17:00
* @updated 2023/12/23 18:00
*/
<template>
	<view class="member">
		<u-navbar :border-bottom="false" title-size="35" title="成员"></u-navbar>
		<u-swipe-action :show="item.show" :index="index" v-for="(item, index) in memberList" :key="item.userID"
			@click="click" @open="open" :options="item.role=='Admin'?options1:options">
			<view class="item u-border-bottom">
				<image mode="aspectFill" :src="item.avatar" />
				<!-- 此层wrap在此为必写的，否则可能会出现标题定位错误 -->
				<view class="title-wrap">
					<text class="title u-line-2">{{ item.nick }}</text>
					<text v-if="item.role=='Admin'">管理员</text>
					<text v-if="item.role=='Owner'">群主</text>
				</view>
			</view>
		</u-swipe-action>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				conversation: {},
				memberList: [],
				list: [{
						id: 1,
						title: '长安回望绣成堆，山顶千门次第开，一骑红尘妃子笑，无人知是荔枝来',
						images: 'https://cdn.uviewui.com/uview/common/logo.png',
						show: false
					},
					{
						id: 2,
						title: '新丰绿树起黄埃，数骑渔阳探使回，霓裳一曲千峰上，舞破中原始下来',
						images: 'https://cdn.uviewui.com/uview/common/logo.png',
						show: false
					},
					{
						id: 3,
						title: '登临送目，正故国晚秋，天气初肃。千里澄江似练，翠峰如簇',
						images: 'https://cdn.uviewui.com/uview/common/logo.png',
						show: false,
					}
				],
				disabled: false,
				btnWidth: 180,
				show: false,
				options: [{
						text: '删除',
						style: {
							backgroundColor: '#007aff'
						}
					},
					{
						text: '设置成管理员',
						style: {
							backgroundColor: '#dd524d'
						}
					}
				],
				options1: [{
						text: '删除',
						style: {
							backgroundColor: '#007aff'
						}
					},
					{
						text: '取消管理员',
						style: {
							backgroundColor: '#dd524d'
						}
					}
				],
				userID: ''
			}
		},
		onLoad(options) {
			console.log(JSON.parse(options.conversation), '参数')
			this.conversation = JSON.parse(options.conversation)
			this.showMoreHandler()
		},
		methods: {
			click(index, index1) {
				this.userID = this.memberList[index].userID
				if (index1 == 1) {
					if(this.memberList[index].role=='Admin'){
						// 取消管理员
						this.closeMangger()
					}else{
						// 设置管理员
						this.mangger()
					}
				} else {
					// 删除
					this.del()
				}
			},
			// 如果打开一个的时候，不需要关闭其他，则无需实现本方法
			open(index) {
				this.memberList[index].show = true;
				this.memberList.forEach((val, idx) => {
					if (index != idx) this.memberList[idx].show = false;
				})
				this.$forceUpdate();
			},
			showMoreHandler() {
				uni.$TUIKit
					.getGroupMemberList({
						groupID: this.conversation.groupProfile.groupID,
						count: 50,
						offset: 0
					}) // 从0开始拉取30个群成员
					.then(imResponse => {
						this.memberList = imResponse.data.memberList
						// 遍历数组并添加新属性
						for (var i = 0; i < this.memberList.length; i++) {
							// 为每个对象添加新属性
							this.memberList[i].show = false;
						}
						console.log(this.memberList, '群成员')
						// 			logger.log(`| TUI-group-profile | getGroupMemberList  | getGroupMemberList-length: ${imResponse.data.memberList.length}`);
						// 			console.log(this.conversation.groupProfile, '测试123')
						// 			if (this.conversation.groupProfile.type === 'Private') {
						// 				this.setData({
						// 					addShow: true
						// 				});
						// 			}

						// 			if (imResponse.data.memberList.length > 3) {
						// 				this.setData({
						// 					showMore: true
						// 				});
						// 			}

						// 			this.setData({
						// 				groupmemberprofile: imResponse.data.memberList,
						// 				hidden: !this.hidden,
						// 				notShow: !this.notShow,
						// 				isShow: !this.isShow
						// 			});
					}).catch((error) => {
						// this.$u.toast(error.message);
					})
			},
			// 设置管理员
			mangger() {
				uni.$TUIKit.setGroupMemberRole({
					groupID: this.conversation.groupProfile.groupID,
					userID: this.userID,
					role: uni.$TUIKitTIM.TYPES.GRP_MBR_ROLE_ADMIN // 将群 ID: group1 中的用户：user1 设为管理员
				}).then((imResponse) => {
					console.log(imResponse)
					uni.showToast({
						title: "设置成功",
						icon: "none",
						duration: 2000,
					});
					this.showMoreHandler()
				}).catch((error) => {
					this.$u.toast(error.message);
				})
			},
			// 取消管理员
			closeMangger(){
				uni.$TUIKit.setGroupMemberRole({
					groupID: this.conversation.groupProfile.groupID,
					userID: this.userID,
					role: uni.$TUIKitTIM.TYPES.GRP_MBR_ROLE_MEMBER // 将群 ID: group1 中的用户：user1 设为管理员
				}).then((imResponse) => {
					console.log(imResponse)
					uni.showToast({
						title: "设置成功",
						icon: "none",
						duration: 2000,
					});
					this.showMoreHandler()
				}).catch((error) => {
					this.$u.toast(error.message);
				})
			},
			// 删除
			del() {
				let arr = []
				arr[0] = this.userID
				uni.$TUIKit.deleteGroupMember({
					groupID: this.conversation.groupProfile.groupID,
					userIDList: arr,
					reason: '你违规了，我要踢你！'
				}).then((imResponse) => {
					console.log(imResponse)
					uni.showToast({
						title: "删除成功",
						icon: "none",
						duration: 2000,
					});
					this.showMoreHandler()
				}).catch((error) => {
					if (error.code == 10007) {
						uni.showToast({
							title: "操作权限不足",
							icon: "none",
							duration: 2000,
						});
					} else if (error.code == 10004) {
						uni.showToast({
							title: "不能删除自己",
							icon: "none",
							duration: 2000,
						});
					} else {
						this.$u.toast(error.message);
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.member {
		.item {
			display: flex;
			padding: 20rpx;
		}

		image {
			width: 120rpx;
			flex: 0 0 120rpx;
			height: 120rpx;
			margin-right: 20rpx;
			border-radius: 12rpx;
		}

		.title {
			text-align: left;
			font-size: 28rpx;
			color: $u-content-color;
			margin-top: 20rpx;
		}
	}
</style>